// General layout Variables
// --------------------------------------------------

$font-family-base			: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif
$font-size-base				: 11px
$font-semibold				: 600


$body-bg					: #ebeef0
$body-color					: #5f5f5f
$link-color					: $body-color
$link-hover-color			: darken($body-color, 5%)
$border-color-base			: #e9e9e9
$border-radius-base			: 0
$selection-color			: rgba(46, 165, 204, 0.41)
$grid-gutter-width			: 15px


$state-active-bg            : #54abd9
$state-active-color         : #ffffff





// CLEAN ZONE (LOGIN, REGISTER, AND ERROR PAGES CONTAINER)
//============================================
$cls-bg                     : #212124
$cls-color                  : #ffffff






// NAVIGATION
//============================================
$mainnav-bg                 : #2d3c4b
$mainnav-color              : #abb1b7
$mainnav-hover-color        : #ffffff
$mainnav-active-bg          : transparent
$mainnav-active-color       : #ffffff
$mainnav-active-state       : darken($state-active-bg, 15%)
$mainnav-lg-width           : 220px
$mainnav-sm-width           : 50px



// NAVBAR
//============================================
$navbar-bg                  : #ffffff
$navbar-color               : $body-color
$brand-bg                   : transparent
$brand-bg-overlay           : $mainnav-bg
$brand-color                : $state-active-color
$brand-color-overlay        : $navbar-color
$brand-font-size            : 18px
$navbar-height				: 40px





// Reduce the file size by disabling features that you do not use.
$mainnav-collapse           : true
$mainnav-slide              : true
$mainnav-reveal             : true












// ASIDE
//============================================
$aside-width                : $mainnav-lg-width
$aside-dark-bg              : lighten($mainnav-bg,5%)
$aside-dark-color           : #ffffff
$aside-bright-bg            : #ffffff
$aside-bright-color         : #515151
$aside-tabs					: true










// FOOTER
//============================================
$footer-bg                  : #ccced0
$footer-color               : $body-color
















// ANIMATION
//============================================
$enable-animation           : true
$enable-easeInQuart         : true
$enable-easeOutQuart        : true
$enable-easeInBack          : true
$enable-easeOutBack         : true
$enable-easeInOutBack       : true
$enable-steps               : true
$enable-jumping             : true
$enable-rubber              : true




//Animation duration
$ease-duration              : .35s
$easeInQuart                : .35s
$easeOutQuart               : .4s
$easeInBack                 : .35s
$easeOutBack                : .35s
$easeInOutBack              : .5s
$steps                      : .5s
$jumping                    : .7s
$rubber                     : .5s



















// COMPONENT
//============================================



// Reduce the file size by disabling the color of the components that you do not use.
$enable-mint                : true
$enable-purple              : true
$enable-pink                : true
$enable-dark                : true





$light-bg                   : #ffffff
$gray-bg                    : #e3e8ee

$primary-bg                 : #5fa2dd
$info-bg                    : #46bbdc
$success-bg                 : #91c957
$warning-bg                 : #f1aa40
$danger-bg                  : #f76549
$mint-bg                    : #42cca5
$purple-bg                  : #9f5594
$pink-bg                    : #e17ca7
$dark-bg                    : #33373a

$text-muted                 : lighten($body-color,30%)
$light-color                : #515151
$gray-color                 : #515151
$primary-color              : #ffffff
$info-color                 : #ffffff
$success-color              : #ffffff
$warning-color              : #ffffff
$danger-color               : #ffffff
$mint-color                 : #ffffff
$purple-color               : #ffffff
$pink-color                 : #ffffff
$dark-color                 : #ffffff



















// OVERWRITE BOOTSTRAP COMPONENT
//============================================


//Disable components that you do not use.
$table                      : true
$form-control               : true
$nav-pills                  : true
$list-group                 : true
$label                      : true
$badge                      : true
$breadcrumb                 : true
$alert                      : true
$modal                      : true
$tooltip                    : true
$popover                    : true
$dropdown                   : true
$well                       : true
$progressbar                : true
$pager                      : true
$pagination                 : true
$carousel                   : true
$accordion                  : true
$tabs                       : true
$bg                         : true
$txt                        : true


$buttons                    : true
$include-btn-hover          : true
$include-btn-active         : true
$include-btn-labeled        : true
$include-btn-circle         : true
$include-btn-icon           : true
$include-btn-rounded        : true






$tooltip-bg                 : #1c1e21
$state-success              : darken($success-bg,20%)
$state-warning              : darken($warning-bg,20%)
$state-danger               : darken($danger-bg,20%)







$panels                     : true
$panel-heading-height       : 50px
$panel-w-tabs               : true
$panel-w-progressbar        : true
$panel-w-pagination         : true
$panel-w-pager              : true
$panel-w-btn                : true





// EXTRA
//============================================
$megamenu					: true

$timeline                   : true
$timeline-bg                : $body-bg
$timeline-color             : $body-color
$timeline-border-color		: darken($gray-bg, 20%)



$email                      : true
$email-list-odd             : rgba(0, 66, 78, 0.05)
$email-list-hover           : rgba(0, 66, 78, 0.065)
$email-highlight            : #f2f0c2
$email-stared-color         : #ffa100
$email-stared-hover         : lighten($email-stared-color,15%)
$email-unstared-color       : $text-muted



$form-wizard                : true
$include-form-wizard-classic: true
$include-form-wizard-steps  : true






// EXCLUSIVE PLUGIN STYLESHEET
//============================================
$nifty-scrollTop             : true
$nifty-language-selector     : true
$nifty-overlay               : true
$nifty-noty                  : true
$nifty-check                 : true
$nifty-check-bg              : transparent
$nifty-check-color           : #515151
$nifty-check-border          : #5f5f5f
$nifty-check-border-radius   : $border-radius-base



$full-calendar				: true






// Global Mixin
// ------------------------------------------------------
@mixin transform($transform)
    -webkit-transform: $transform
    -ms-transform: $transform
    transform: $transform


@mixin transition($transition)
    -webkit-transition: $transition
    transition: $transition


//@mixin transition($a;$b;...)
//    $transition :  ~`"${arguments}".replace(/[\[\]]/g, '')`
//    -webkit-transition: $transition
//    transition: $transition

@mixin transition($transitions...)
    $unfoldedTransitions: ()
    @each $transition in $transitions
        $unfoldedTransitions: append($unfoldedTransitions, $transition, comma)

    -webkit-transition: $unfoldedTransitions
    transition: $unfoldedTransitions



@mixin selection($color)
    ::selection
        background-color: $color

    ::-moz-selection
        background-color: $color


